.login-page {
  width: 100vw;
  height: 100vh;
  background-image: url('/assets/login-bg.png');
  background-position: center;
  background-repeat: no-repeat;
}

.panel {
  display: flex;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 1120px;
  height: 512px;
  transform: translate(-50%, -50%);
  transition: all 0.5s;

  .panel-image {
    flex: 1;
    width: 0;
    background-image: url('/assets/login-left.png');
    background-size: 100% 100%;
    background-repeat: no-repeat;
  }

  .panel-body {
    flex: 1;
    width: 0;
    padding-top: 50px;
    background-color: #fff;

    .form-title {
      margin-bottom: 70px;
      text-align: center;
    }

    .form {
      margin: 0 120px 70px;
    }

    .company {
      text-align: center;
    }
  }
}

@media screen and (max-width: 1200px) {
  .panel {
    width: 860px;
    height: 450px;

    .panel-body {
      padding-top: 30px;

      .form-title {
        margin-bottom: 50px;
      }

      .form {
        margin: 0 90px 50px;
      }
    }
  }
}

@media screen and (max-width: 992px) {
  .panel {
    width: 560px;
  }

  .panel-image {
    display: none;
  }

  .panel-body {
    padding-top: 30px;

    .form-title {
      margin-bottom: 50px;
    }

    .form {
      margin: 0 90px 50px;
    }
  }
}
